<article class="module-deposit">
    <div class="recharge-coin">
        <div class="ui-account-box">
            <!-- <template v-if="hasAuth === false">
                <div class="ui-account-box-inner">
                    <div class="ui-title">
                        <span class="text">{{ $t('common.deposit') }}</span>
                    </div>
                    <div class="no-auth">
                        <span class="text">{{ $t('asset.deposit.toVerification1') }}</span>
                        <a href="#/certification">{{ $t('asset.deposit.toVerification2') }}</a>
                        <span class="text">{{ $t('asset.deposit.toVerification3') }}</span>
                    </div>
                </div>
            </template> -->
            <div class="ui-account-box-inner">
                <div class="ui-title">
                    <span class="strong">{{coinType}}</span>
                    <span class="text">{{ $t('common.deposit') }}</span>
                    <span v-if="coinType=='GNB'" style="color: #ababab;font-size: 11px;margin-left: 13px;">
                        为了让更多用户参与体验，交易所每个账户最多可解锁1000个GNB，请勿向同一个账户里转入超限。
                    </span>
                </div>
                <div class="asset-info">
                    <asset-drop v-if="coinList" :coin="coinType" :coin-list="coinList" :onSuccess="changeCoinType">
                    </asset-drop>
                    <span class="asset-info-item price">{{$t('common.newPrice')}}：<b>${{usdPrice}}</b></span>
                    <span class="asset-info-item price"><b>¥{{cnyPrice}}</b></span>
                    <span class="asset-info-item">{{$t('common.available')}}：{{coinBalance}}</span>
                    <span class="asset-info-item fn-gray">{{$t('common.held')}}：{{coinLock}}</span>
                </div>
                <div class="box-content">
                    <div class="coin-address">
                        <!--<div ref="qrcode"></div>-->
                        <p class="address-name">{{ $t('asset.deposit.depositAddress') }}</p>
                        <input type="text " class="address-content" id="address" v-model="address"
                            @click="copyAddress('#address')" readonly="readonly" autocomplete="off">
                        <!--<p class="address-content">{{address}}</p>-->
                        <template
                            v-if="coinType==='SWTC'|| coinType==='WKT' ||coinType==='NTCC' ||coinType==='TCC' ||coinType==='MAE' || coinType=='CALL'">
                            <span @click="matchAsset('#address')" class="address-copy">
                                <button type="button" class='primary'>{{ $t('asset.deposit.synAsset') }}</button>
                            </span>
                        </template>
                        <template v-else>
                        </template>
                        <span class="address-copy" @click="copyAddress('#address')"><i class="icon-copy"></i></span>
                        <div class="address-qrcode">
                            <popover placement="top" :title="addressTip" trigger="hover" width="170">
                                <i class="icon-qrcode"></i>
                                <div class="tip-box" slot="content">
                                    <qrcode :val="address" :size="140"></qrcode>
                                </div>
                            </popover>
                        </div>

                        <div class="address-btn">
                            <a href="https://www.changwai.io/" v-if="coinType === 'USC'" class="ui-btn"
                                target="_blank">{{$t('asset.deposit.outside')}}</a>
                        </div>

                    </div>
                </div>
            </div>
            <div class="ui-account-box-inner" v-if="coinType === 'USC'">
                <usc></usc>
            </div>
            <div class="ui-account-box-inner">
                <div class="ui-title-account">
                    <span class="strong">{{coinType }}</span>
                    <span class="text">{{ $t('asset.deposit.depositRecords') }}</span>
                    <span class="icon" @click="fetchList"><i class="icon-reload"></i></span>
                </div>
                <div class="box-content">
                    <div class="table-wrap">
                        <div class="m-table">
                            <table>
                                <thead>
                                    <tr>
                                        <th width="25%">{{ $t('asset.deposit.time') }}</th>
                                        <th width="40%" class="fn-ta-right">{{ $t('asset.deposit.depositVolume')
                                            }}({{coinType }})</th>
                                        <th width="35%" class="fn-ta-right">{{ $t('asset.deposit.status') }}&emsp;
                                        </th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr v-for="item in list" v-if="(isLoading === false)&&(list.length > 0)">
                                        <td>{{item.updateDate | timezone}}</td>
                                        <td class="fn-ta-right">{{filter.floorFix(item.amount,8)}}</td>
                                        <td class="fn-ta-right" :class="{'fn-green':item.status === 'SUCCESS',
                                 'fn-blue':item.status === 'WAITING',
                                 'fn-blue':item.status=='PROCESSING',
                                 'fn-dark-gray':item.status=='FAILURE',
                                 'fn-orange':item.status=='REFUSE'}">
                                            {{item.statusText}}
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                            <loading v-if="isLoading"></loading>
                            <no-data v-if="isLoading === false && list && list.length === 0"></no-data>
                        </div>
                        <pager :page-no="condition.pageNo" :page-size="condition.pageSize"
                            :on-page-change="changePage" :page-num="condition.pageNum"></pager>
                    </div>
                </div>
            </div>


        </div>
    </div>

</article>